<template>
  <div class="rehome">
    <el-row  class="home">
      <el-col :span="4" class="logo"><a href="" ><img src="../assets/logo.png" alt=""></a></el-col>
      <el-col :span="10" class="fr user flex" >
        <div class="re-li">432232144</div>
        <div class="re-li">43214</div>
        <div class="re-li">43214</div>
        <div class="flex">
          <span class="padding-r-10 re-li">宇宙Joe</span>
          <div class=" re-lilog">
            <a href="" ><img src="../assets/logo.png" alt="" class="img"></a>
          </div>
        </div>
      </el-col>
    </el-row>
  </div>
</template>

<script>
export default {
  data() {
    return {

    }
  }
}
</script>

<style lang="less" scoped>
.rehome {
  height: 40px;
  background: #414A60;
}
.home {
 max-width: 1200px;
 margin: 0 auto;
 color:#fff;
 .bg-purple-dark {
  //  height: 40px;
  //  background: #99a9bf;
  }
  .logo {
    width: 110px;
    height: 40px;
    img {
      width: 100%;
      height: 100%;
    }
  }
  .re-l {
    border-radius: 50%;
    overflow: hidden;
    img {
    width: 26px;
    height: 26px;
    }
  }
  .user {
      justify-content: flex-end;
      .re-li {
        line-height: 40px;
      }
      .re-lilog {
        width: 25px;
        height: 25px;
        overflow: hidden;
        border-radius: 50%;
      }
  }
}
</style>
